<template>
  <div class="product-list">
    <div 
      v-for="product in products" 
      :key="product.id" 
      class="product-card"
      @click="handleProductClick(product)"
    >
      <!-- ... 商品卡片内容 ... -->
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useAuth } from '@/stores/auth'

const router = useRouter()
const { isLoggedIn } = useAuth()

// 添加 products 数据
const products = ref([
  {
    id: 1,
    name: '商品1',
    // ... 其他商品属性
  }
])

const handleProductClick = (product: any) => {
  if (!isLoggedIn.value) {
    router.push('/login')
    return
  }
  
  router.push(`/products/${product.id}`)
}
</script> 